
//执行上传的方法
layui.use('upload', function(){
    let upload = layui.upload;

    //执行实例
    let uploadInst = upload.render({
        elem: '#upload_button' //绑定元素
        ,url: '/upload/' //上传接口
        ,done: function(res){
            //上传完毕回调
        }
        ,error: function(){
            //请求异常回调
        }
    });
});


//懒加载图片
layui.use('flow', function() {
    let flow = layui.flow;


    function video_generater(name,id,date,details_url,img_url) {
        let html_string = "<div class=\"layui-col-md3\" style='margin-top: 10px'>\n" +
            "                        <a id=\""+id+"\" href=\"\" >\n" +
            "                            <div class=\"layui-row\">\n" +
            "                                <img src=\""+img_url+"\" style=\"height: 149px;width: 264px; border-radius: 10px;z-index: 1\" >\n" +
            "\n" +
            "\n" +
            "                                <div class=\"handle layui-hide\" id=\""+id+"handle\">\n" +
            "                                    <br>\n" +
            "                                    <br>\n" +
            "                                    <br>\n" +
            "                                    <i class=\"layui-icon icon-myself \" >&#xe652;</i>\n" +
            "                                </div>\n" +
            "\n" +
            "                            </div>\n" +
            "                            <div class=\"layui-row\" style=\"margin-top: 10px\">\n" +
            "                               <a class=\"layui-font-14 layui-bold \" >\n" +
                                                name +
            "                                    ·\n" +
                                                date +
            "                               </a>\n" +
            "                            </div>\n" +
            "\n" +
            "                        </a>\n" +
            "\n" +
            "\n" +
            "\n" +
            "\n" +
            "                    </div>"

        return html_string
    }








    //初始加载视频预览图的方法
    flow.load({
        elem: '#video' //流加载容器
        , done: function (page, next) { //执行下一页的回调


            //模拟数据插入
            setTimeout(function () {
                let $ = layui.jquery

                //假设总页数为 5
                let pages = 5

                let lis = []
                for (let i = 1; i <= 12; i++) {

                    let id = (page-1)*12+i
                    lis.push(video_generater(id,id,"2-13","","/static/img/test/IMG_1008.jpg"))


                    //实现鼠标悬停弹出播放标志效果的核心算法

                }




                //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
                //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多




                next(lis.join(''), page <pages);
                // alert(page)
                for(let j=1;j<=12*pages;j++){
                    $('#'+j).mouseenter(function (){
                        $('#'+j+'handle').removeClass('layui-hide');
                    }).on("mouseleave",".handle",function (){
                        $('#'+j+'handle').addClass('layui-hide');
                    })
                }



            }, 500);


        }
    });
})


$(document).ready(function (){


})

